import {Component} from 'react';

class AddTask extends Component {
    state = {task:''} 
  
      // 同步任务内容
      handleChange = (e) => {
        this.setState({
            task: e.target.value
        })
    }
  
     // 添加任务
     handleAddTask = () => {
        const { task} = this.state
        const { addTask } = this.props
        if (!task)return
  
        //添加数据 : 同步到state  00ff11
        let taskNew = { task: task, date: new Date().toLocaleDateString() }
        addTask(taskNew)
  
        //视图优化
        this.setState({
            task: '' //清空输入
        })
    }
  
    render() {
        return (
            <div>
                <input type='text'  value={this.state.task} onChange={this.handleChange}/>
                <button onClick={this.handleAddTask}>add task</button>
            </div>
        )
    }
  }

  export default AddTask